import {makeAutoObservable, reaction, set, toJS } from 'mobx'

const dirStore = makeAutoObservable({
  direction: null,
  setDirection(value) {
   this.direction = value
  }
})

reaction(
  ()=>dirStore.direction,
  ()=> console.log('direction changed: ', dirStore.direction)
)

dirStore.setDirection(0)
dirStore.setDirection(1)
dirStore.setDirection(2)
dirStore.setDirection(2)
dirStore.setDirection(2)
dirStore.setDirection(1)


const sortStore = makeAutoObservable({
  obj: {},
  addItem(key, objValue) {
    set(this.obj, key, objValue)
  },
  updateWithKey(id, obj) {
    Object.assign(this.obj[id], obj)
  },
  get reversed() {
    return reverseObj(this.obj)
  }
})

function reverseObj (obj) {
  return Object.keys(obj).reverse().reduce((a,key,i)=>{
      a[key] = obj[key];
      return a;
  }, {})
};


sortStore.addItem("georgehu", {age: 30})
sortStore.addItem("vicky", {age: 1})
console.log('000000000000', toJS(sortStore.reversed))
console.log('11111111111111', toJS(sortStore))
Object.keys(sortStore.reversed).map(key=>console.log(key))
